<template>
    <div class="a-text c-f-h c-f-s-center" :class="[`size-${mySize}`]">
        <slot></slot>
    </div>
</template>

<style lang="scss" scoped>
@import "../scss/vars";

.a-text {
    @each $sizePackageName, $sizePackageValue in $sizePackages {
        &.size-#{$sizePackageName} {
            padding-right: map-get($sizePackageValue, "space");
            height: map-get($sizePackageValue, "size");

            font-size: map-get($sizePackageValue, "fontSize");
        }
    }
}
</style>

<script>
import formItemMixin from "../mixins/formItemMixin"

export default {
    name: 'AText',
    mixins: [formItemMixin],
}
</script>